<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:sigecComp="http://java.sun.com/jsf/composite/components">

	<h:outputStylesheet library="css" name="textos.css" />    
   	<h:outputStylesheet library="css" name="bordes.css"/>
   	<h:outputStylesheet library="css" name="botones.css"/>
   	<h:outputScript library="js" name="validaciones.js" target="head"/>
   	
   	
   	
   	<h:outputScript library="js" name="jquery.effects.core.js" />
	<h:outputScript library="js" name="jquery.effects.blind.js" />
    <h:outputStylesheet library="css" name="componentsCss.css" />
    <h:outputScript  library="js" name="componentsJs.js" />
    
   	<h:outputStylesheet library="css" name="tables.css" />

	<h:form id="frmAdmUsr">
		

		<rich:panel header="#{msg.administracion_de_usuarios}" id="pnlDocente">
			
			<rich:collapsiblePanel header="#{msg.criterios_busqueda}"  headerClass="headerDivCollap" styleClass="mainDivCollap" 
				leftCollapsedIcon="triangleDown" leftExpandedIcon="triangleUp" switchType="client">
				
				<h:panelGroup>
					<h:panelGrid columns="2">
						<h:outputLabel value="Buscar por :" styleClass="label-bold"/>
						<h:selectOneRadio value="#{creacionUsuarioController.filtroBusqueda}" id="somFiltroBusqueda">
							<f:selectItem itemLabel="Usuario" itemValue="usr"/>
							<f:selectItem itemLabel="#{msg.cedula}" itemValue="ced"/>
							<f:selectItem itemLabel="#{msg.primer_apellido}" itemValue="ape"/>
						</h:selectOneRadio>
					</h:panelGrid>
					<h:panelGrid columns="2" style="margin-left: 80px;">
						<h:inputText value="#{creacionUsuarioController.txtFiltroBusqueda}" id="txtFiltroBusqueda" required="true" requiredMessage="El campo es requerido"/>
						<a4j:commandLink action="#{creacionUsuarioController.btnFindUsr}"   
							execute="somFiltroBusqueda txtFiltroBusqueda" render="tblPersonas">
							<h:graphicImage library="images/button"  name="search_button.png" style="border:0px;"/>
						</a4j:commandLink>
					</h:panelGrid>
				</h:panelGroup>
			</rich:collapsiblePanel>
			
			<rich:collapsiblePanel header="Resultados"  headerClass="headerDivCollap" styleClass="mainDivCollap" 
				leftCollapsedIcon="triangleDown" leftExpandedIcon="triangleUp" switchType="client">
				<h:panelGroup id="tblPersonas">
					<h:panelGroup layout="block" style="width:100; text-align:center;" styleClass="rf-pp-hdr">
						<rich:dataScroller for="tblUsuarios" renderIfSinglePage="false" style="margin:auto;" fastControls="hide" scrollListener="#{creacionUsuarioController.scrollListener}"/>
					</h:panelGroup>
					<rich:dataTable id="tblUsuarios" value="#{creacionUsuarioController.lstPersonas}" var="lstPersona" style="width:100%" 
						rendered="#{!empty creacionUsuarioController.lstPersonas}" rows="15" iterationStatusVar="numRow">
						<rich:column style="text-align:center;">
							<f:facet name="header">
								<h:outputLabel value="#" />
							</f:facet>
							<h:outputText value="#{numRow.index +1}" />
						</rich:column>
						
						<rich:column style="text-align:center;">
							<f:facet name="header">
								<h:outputLabel value="#{msg.cedula}" />
							</f:facet>
							<a4j:commandLink value="#{lstPersona.cedula}" execute="@this" render="tblPerfilesEdit pnlDatosPersona" 
								action="#{creacionUsuarioController.personaSeleccionadaBucarPerfil(lstPersona)}"
								oncomplete="#{rich:component('popup')}.show()" >
							</a4j:commandLink>
						</rich:column>
						
						<rich:column>
							<f:facet name="header">
								<h:outputLabel value="#{msg.nombres}" />
							</f:facet>
							<h:outputText value="#{lstPersona.nombreCompleto} " />
						</rich:column>
					</rich:dataTable>
				
					<rich:panel rendered="#{empty creacionUsuarioController.lstPersonas}">
						No se encontraron resultados
					</rich:panel>
				</h:panelGroup>
			</rich:collapsiblePanel>
		</rich:panel>
		
		
		<rich:popupPanel id="popup" modal="true" resizeable="true"  header="Edicion del usuario" domElementAttachment="parent" width="500" height="560" top="10" left="180">
        
	        <f:facet name="controls">
	            <h:outputLink value="#" onclick="#{rich:component('popup')}.hide(); return false;">
	                <h:graphicImage library="org.richfaces" name="close_act.gif" style="border:0px;"/>
	            </h:outputLink>
	        </f:facet>
	        <h:panelGroup>
	        	<rich:collapsiblePanel header="#{msg['datos_personales']}"  headerClass="headerDivCollap" styleClass="mainDivCollap" 
				leftCollapsedIcon="triangleDown" leftExpandedIcon="triangleUp" switchType="client">
					<h:panelGroup id="pnlDatosPersona">
						<h:panelGrid columns="2">
							<h:outputLabel value="#{msg['identificador']} :"  style="float:left; width:150px;" />
							<h:outputText value="#{creacionUsuarioController.personaSeleccionada.usuario.identificador}"/>
							
							<h:outputLabel value="#{msg['clave']} :"  style="float:left; width:150px;" />
							<h:inputSecret value="#{creacionUsuarioController.personaSeleccionada.usuario.clave}"/>
						</h:panelGrid>
						
						<h:panelGrid columns="2" columnClasses=",colRemoveSpace">
							<h:outputLabel value="#{msg['cedula']} :"  style="width:150px; display:block;" />
							
							<sigecComp:textField id="txtCedula" maxLength="10" inputTextClass="cajaRequerida" value="#{creacionUsuarioController.personaSeleccionada.cedula}" required="false" label="#{msg['cedula']}" editMode="true" onkeypressScript="return validateNumPP(event);">
								<!--f:validator  for="Input" validatorId="cedulaValidator"></f:validator-->
							</sigecComp:textField>
		
							<h:outputLabel value="#{msg['nombres']} :" />
							<h:panelGrid columns="2" styleClass="removeSpacesTable" columnClasses="colRemoveSpace">
								<sigecComp:textField inputTextClass="cajaRequerida" value="#{creacionUsuarioController.personaSeleccionada.primerNombre}" required="false" label="El campo #{msg['nombre']} es obligatorio" editMode="true"/>
								<h:inputText id="txtNombDos" value="#{creacionUsuarioController.personaSeleccionada.segundoNombre}"/>
							</h:panelGrid>	
							
							<h:outputLabel value="#{msg['apellidos']} :" />
							<h:panelGrid columns="2" styleClass="removeSpacesTable" columnClasses="colRemoveSpace">
								<sigecComp:textField inputTextClass="cajaRequerida" value="#{creacionUsuarioController.personaSeleccionada.primerApellido}" required="false" label="#{msg['apellidos']}" editMode="true"/>
								<h:inputText value="#{creacionUsuarioController.personaSeleccionada.segundoApellido}" />
							</h:panelGrid>
		
							<h:outputLabel value="#{msg['fecha_nacimiento']} :" />
							<rich:calendar value="#{creacionUsuarioController.personaSeleccionada.fechaNacimiento}" datePattern="#{msg['dd_MMM_yyyy']}">
							</rich:calendar>
		
							<h:outputLabel value="#{msg['nacionalidad']} :" />
							<h:inputText value="#{creacionUsuarioController.personaSeleccionada.nacionalidad}" size="43"/>
		
							<h:outputLabel value="#{msg['direccion']} :" />
							<h:inputText value="#{creacionUsuarioController.personaSeleccionada.direccion}" size="43"/>
		
							<h:outputLabel value="#{msg['e_mail']} :" />
							<h:inputText value="#{creacionUsuarioController.personaSeleccionada.mail}" size="43"/>
		
							<h:outputLabel value="#{msg['celular']} :" />
							<h:inputText value="#{creacionUsuarioController.personaSeleccionada.telefonoCelular}" maxlength="15" onkeypress="return validateNumPP(event);"/>
						</h:panelGrid>
					</h:panelGroup>
				</rich:collapsiblePanel>
				
				<rich:collapsiblePanel header="#{msg.etiqueta_perfil}"  headerClass="headerDivCollap" styleClass="mainDivCollap" 
					leftCollapsedIcon="triangleDown" leftExpandedIcon="triangleUp" switchType="client">
					<rich:dataTable value="#{creacionUsuarioController.lstPerfilesUsuario}" var="perfil" style="width:100%;" id="tblPerfilesEdit">
						<f:facet name="header">
							<h:outputLabel value="Seleccione un perfil" />
						</f:facet>
						<rich:column style="text-align:center;">
							<f:facet name="header">
								<h:outputLabel value="Seleccionar" />
							</f:facet>
							<h:selectBooleanCheckbox value="#{perfil.selected}" />
						</rich:column>
						
						<rich:column>
							<f:facet name="header">
								<h:outputLabel value="Nombre del perfil" />
							</f:facet>
							<h:outputText value="#{perfil.perfil.nombre}" />
						</rich:column>
						
						<rich:column>
							<f:facet name="header">
								<h:outputLabel value="#{msg.descripcion}" />
							</f:facet>
							<h:outputText value="#{perfil.perfil.descripcion}" />
						</rich:column>
					</rich:dataTable>
				</rich:collapsiblePanel>
	        </h:panelGroup>
	        
	        <h:panelGroup layout="block" style="width:100%; margin:auto; " styleClass="rf-pp-hdr">
	        	<h:panelGrid columns="2" style="margin:auto;">
	        		<a4j:commandLink value="Aceptar" oncomplete="if(#{facesContext.maximumSeverity.ordinal !=2}) #{rich:component('popup')}.hide();" 
	        			execute="pnlDatosPersona, tblPerfilesEdit, tblUsuarios" render="pnlDatosPersona" 
	        			action="#{creacionUsuarioController.btnActualizarUsuario}"/>
	        		<a4j:commandLink value="Cancelar" oncomplete="" execute="@form" immediate="true" 
	        			action="#{creacionUsuarioController.btnCancelarEdicion}" 
	        			render="popup"/>
	        	</h:panelGrid>
	        </h:panelGroup>
        </rich:popupPanel>
	</h:form>
</ui:composition>
